<template>
	<view class="main feedback-main">
		<NavigationBar title="确认订单" />
		<div class="scroll-wrap">
			<div class="feedback-content">
				<text class="title">问题和建议</text>
				<div class="input-box">
					<textarea class="textarea" v-model="params.content" placeholder-class="placeholder" placeholder="请详细描述您的问题或建议"/>
				</div>
				<text class="title">相关图片（选填）</text>
				<div class="upload-wrap">
					<image class="picture" v-for="(item,index) in filie" :src="item" @click="previewImageAction(index)"></image>
					<div class="upload-file flex-center" @click="choseFileAction">
						<text class="iconfont upload-file-icon">&#xe63a;</text>
					</div>
				</div>
				<text class="title">联系人</text>
				<div class="input-box">
					<input class="uni-input" v-model="params.name" placeholder-class="placeholder" placeholder="请留下您的姓名或称呼" />
				</div>
				<text class="title">联系方式</text>
				<div class="input-box">
					<input class="uni-input" v-model="params.phone" maxlength="11" type="number" placeholder-class="placeholder" placeholder="请留下您的联系方式" />
				</div>
			</div>
			<view class="submit-btn-wrap">
				<view class="submit-btn flex-center" @click="submitAction">
					<text class="btn-text">提交</text>
				</view>
			</view>
		</div>
	</view>
</template>

<script lang="ts">
	export default {
		data() {
			return {
				params: {
					content: '',
					name: '',
					phone: ''
				},
				filie: []
			};
		},
		methods: {
			submitAction() {
				const _this:any = this
				console.log(_this.params)
				_this.$util.goBack()
			},
			choseFileAction() {
				const _this:any = this
				uni.chooseImage({
				    count: 6, //默认9
				    sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
				    sourceType: ['album','camera'], //从相册相机选择
				    success: function (res: any) {
						uni.getImageInfo({
							src: res.tempFilePaths[0],
							success: function (image:any) {
								_this.filie.push(image.path)
								console.log(image)
							}
						});
						
				    }
				});
			},
			previewImageAction(index: any) {
				const _this:any = this
				console.log('======',index)
				uni.previewImage({
					current: index,
					urls: _this.filie,
					indicator: 'number',
					loop: true
				});
			}
		}
	}
</script>

<style lang="scss">
	@import './feedback.scss';
</style>
